<template>
  <div class="detail">
    <el-breadcrumb separator="/" class="breadcrumb">
      <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item :to="{ path: '/enterprise/myBiddding' }">我的标的</el-breadcrumb-item>
      <el-breadcrumb-item>企业信息确认</el-breadcrumb-item>
    </el-breadcrumb>

    <div class="content">
      <div class="title">企业基本信息</div>
      <el-form :model="enterpriseData" ref="form" :rules="rules" label-width="200px">
        <el-row>
          <el-col :span="12">
            <el-form-item label="企业名称" prop="name">
              <el-input v-model="enterpriseData.name"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="统一社会信用代码" prop="usci">
              <el-input v-model="enterpriseData.usci"></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-form-item label="公司注册地址" prop="address">
          <el-input v-model="enterpriseData.address"></el-input>
        </el-form-item>

        <el-row>
          <el-col :span="8">
            <el-form-item label="机构类型" prop="affiliation">
              <el-select v-model="enterpriseData.affiliation">
                <el-option v-for="dict in enterpriseAffiliation" :key="dict.value" :label="dict.label" :value="dict.value"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="企业性质" prop="enterpriseNature">
              <el-select v-model="enterpriseData.enterpriseNature">
                <el-option v-for="dict in enterpriseNature" :key="dict.value" :label="dict.label" :value="dict.value"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="成立日期" prop="doe">
              <el-date-picker v-model="enterpriseData.doe" type="date" placeholder="选择日期"></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="12">
            <el-form-item label="法人/负责人" prop="corpn">
              <el-input v-model="enterpriseData.corpn"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="法人/负责人身份证" prop="corpnIdcard">
              <el-input v-model="enterpriseData.corpnIdcard"></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-form-item label="法人/负责人身份证扫描件" prop="corpnIdcardImage">
          <ImageUpload v-model="enterpriseData.corpnIdcardImage"></ImageUpload>
        </el-form-item>

        <el-form-item label="单位联系地址" prop="contactAddress">
          <el-input v-model="enterpriseData.contactAddress"></el-input>
        </el-form-item>

        <el-row>
          <el-col :span="12">
            <el-form-item label="经营范围" prop="businessScope">
              <el-input type="textarea" v-model="enterpriseData.businessScope"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="公司简介" prop="profile">
              <el-input type="textarea" v-model="enterpriseData.profile"></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-form-item label="营业执照有效期" prop="businessLicenseGp">
          <el-input v-model="enterpriseData.businessLicenseGp"></el-input>
        </el-form-item>

        <el-form-item label="营业执照扫描件" prop="businessLicenseImage">
          <ImageUpload v-model="enterpriseData.businessLicenseImage"></ImageUpload>
        </el-form-item>

        <el-row>
          <el-col :span="12">
            <el-form-item label="开户行" prop="bank">
              <el-input v-model="enterpriseData.bank"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="银行账号" prop="account">
              <el-input v-model="enterpriseData.account"></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-form-item label="开户行地址" prop="addr">
          <el-input v-model="enterpriseData.addr"></el-input>
        </el-form-item>

        <el-row>
          <el-col :span="12">
            <el-form-item label="单位注册电话" prop="registrationPhone">
              <el-input v-model="enterpriseData.registrationPhone"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="单位注册地址" prop="contactAddr">
              <el-input v-model="enterpriseData.contactAddr"></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="12">
            <el-form-item label="注册资本（万元）" prop="registeredCapital">
              <el-input v-model="enterpriseData.registeredCapital"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="实缴资本" prop="paidinCapital">
              <el-input v-model="enterpriseData.paidinCapital"></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-form-item label="开户许可证/基本户存款信息证" prop="accountLicence">
          <ImageUpload v-model="enterpriseData.accountLicence"></ImageUpload>
        </el-form-item>
      </el-form>

      <div class="title">投标资料上传</div>
      <FileUpload @input="handleFileUpload" :limit="10" :file-size="100"></FileUpload>

      <div style="text-align: center; margin-top: 30px;">
        <el-button type="primary" @click="handleSubmit">提交</el-button>
      </div>
    </div>
  </div>
</template>

<script>
import { getDicts } from '@/api/system/dict/data'
import { getEnterprise, updateEnterprise } from '@/api/bid/enterprise'
import ImageUpload from '@/components/ImageUpload'
import FileUpload from '@/components/FileUpload'

export default {
  name: 'commit',
  components: { ImageUpload, FileUpload },
  data() {
    return {
      enterpriseData: {},
      enterpriseAffiliation: [],
      enterpriseNature: [],
      fileList: [],
      rules: {
        name: [{ required: true, message: '请输入企业名称', trigger: 'blur' }],
        usci: [{ required: true, message: '请输入统一社会信用代码', trigger: 'blur' }],
        address: [{ required: true, message: '请输入公司注册地址', trigger: 'blur' }],
        affiliation: [{ required: true, message: '请选择机构类型', trigger: 'change' }],
        enterpriseNature: [{ required: true, message: '请选择企业性质', trigger: 'change' }],
        doe: [{ required: true, message: '请选择成立日期', trigger: 'change' }],
        corpn: [{ required: true, message: '请输入法人/负责人', trigger: 'blur' }],
        corpnIdcard: [{ required: true, message: '请输入法人/负责人身份证', trigger: 'blur' }],
        corpnIdcardImage: [{ required: true, message: '请上传法人/负责人身份证扫描件', trigger: 'change' }],
        contactAddress: [{ required: true, message: '请输入单位联系地址', trigger: 'blur' }],
        businessScope: [{ required: true, message: '请输入经营范围', trigger: 'blur' }],
        profile: [{ required: true, message: '请输入公司简介', trigger: 'blur' }],
        businessLicenseGp: [{ required: true, message: '请输入营业执照有效期', trigger: 'blur' }],
        businessLicenseImage: [{ required: true, message: '请上传营业执照扫描件', trigger: 'change' }],
        bank: [{ required: true, message: '请输入开户行', trigger: 'blur' }],
        account: [{ required: true, message: '请输入银行账号', trigger: 'blur' }],
        addr: [{ required: true, message: '请输入开户行地址', trigger: 'blur' }],
        registrationPhone: [{ required: true, message: '请输入单位注册电话', trigger: 'blur' }],
        contactAddr: [{ required: true, message: '请输入单位注册地址', trigger: 'blur' }],
        registeredCapital: [{ required: true, message: '请输入注册资本', trigger: 'blur' }],
        paidinCapital: [{ required: true, message: '请输入实缴资本', trigger: 'blur' }],
        accountLicence: [{ required: true, message: '请上传开户许可证/基本户存款信息证', trigger: 'change' }]
      }
    }
  },
  created() {
    this.getDicts('enterprise_affiliation').then(response => {
      this.enterpriseAffiliation = response.data
    })
    this.getDicts('enterprise_nature').then(response => {
      this.enterpriseNature = response.data
    })
    this.getEnterpriseInfo()
  },
  methods: {
    getDicts,
    getEnterpriseInfo() {
      getEnterprise().then(response => {
        this.enterpriseData = response.data
      })
    },
    handleFileUpload(fileList) {
      this.fileList = fileList.map(file => ({
        fileName: file.originalFileName,
        filePath: file.url
      }))
    },
    handleSubmit() {
      this.$refs.form.validate(valid => {
        if (valid) {
          if (this.fileList.length === 0) {
            this.$alert('请上传投标资料')
            return
          }
          const data = {
            ...this.enterpriseData,
            filesList: this.fileList
          }
          updateEnterprise(data).then(() => {
            this.$alert('提交成功')
            this.$router.push('/enterprise/myBidding')
          })
        }
      })
    }
  }
}
</script>

<style scoped>
.title {
  font-size: 24px;
  font-weight: 600;
  margin-top: 60px;
  margin-bottom: 20px;
}
.content {
  padding: 20px;
}
</style>